<template>
	<view class="commodity">
		<img class="bigimg" :src="images" >
		
		<view style="clear: both;"></view>
		
		<view class="itemName">{{name}}</view>
		
		<view class="commodityFoot">
			<p class="money">¥{{price}}</p>
			<button class="buyit" @click="buyit()">购买</button>
			<button class="toshopscar" @click="toshopscar()">加入购物车</button>
		</view>
		
		<button class="AddBlog" @click="toBlog()">发布博客</button>
		
		<view class="voucher" v-for="item in voucher" v-if="voucher != null">
			<view class="left">
				<view>{{item.title}}</view>
				<p>{{item.subTitle}}</p>
				<div>¥{{item.payValue}}</div>
			</view>
			<view class="right">
				<button>购买</button>
			</view>
			<view style="clear: both;"></view>
			<p class="voucherp" v-if="item.type == '1'">{{item.beginTime}}-{{item.endTime}}有效</p>
		</view>
		
	</view>
</template>

<script>
	var itemContent = null
	var images = null
	var name = null
	var price = null
	var voucher = null
	
	export default{
		name:'commodity',
		onLoad:function(){
			uni.request({
				url: "http://" + getApp().globalData.IpAddr + "/goods/" + getApp().globalData.goodsId,
				method:"GET",
				header:{	'authorization':getApp().globalData.token	},
				success:res=> {
					// console.log(res)
					if(!res.data.success) wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
					else {
						getApp().globalData.NowGood = res.data.data
						this.itemContent = getApp().globalData.NowGood
						this.images = this.itemContent.images
						this.name = this.itemContent.name
						this.price = this.itemContent.price
					}
				}
			})
			
			uni.request({
				url: "http://" + getApp().globalData.IpAddr + "/voucher/list/" + getApp().globalData.goodsId,
				method:"GET",
				header:{	'authorization':getApp().globalData.token	},
				success:res=> {
					// console.log(res)
					if(!res.data.success) wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
					else {
						getApp().globalData.cache = null
						getApp().globalData.cache = res.data.data
						this.voucher = getApp().globalData.cache
						// console.log(res)
					}
				}
			})	
			
		},
		data(){
			return{
				itemContent:itemContent,
				images:images,
				name:name,
				price:price,
				voucher:voucher
			}
		},
		methods:{
			buyit(){
				if(getApp().globalData.NowGood.type == 0){
					uni.request({
						url: "http://" + getApp().globalData.IpAddr + "/goods-order/buy-goods/" + getApp().globalData.goodsId,
						method:"POST",
						header:{	'authorization':getApp().globalData.token	},
						success:res=> {
							// console.log(res)
							if(!res.data.success) wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
							else {
								wx.showToast({	title: "购买成功",	duration: 2000	})
							}
						}
					})
				}else{
					uni.request({
						url: "http://" + getApp().globalData.IpAddr + "/goods-order/special-goods/" + getApp().globalData.goodsId,
						method:"POST",
						header:{	'authorization':getApp().globalData.token	},
						success:res=> {
							// console.log(res)
							if(!res.data.success) wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
							else {
								wx.showToast({	title: "购买成功",	duration: 2000	})
							}
						}
					})
				}   
			},
			toshopscar(){
				uni.request({
					url:"http://" + getApp().globalData.IpAddr + "/goods-order/savecart/" + getApp().globalData.goodsId,
					method:"POST",
					header:{	'authorization':getApp().globalData.token	},
					success:res => {
						if(res.data.success) {
							wx.showToast({
							     title: '已加入购物车',
							     duration: 2000//持续的时间
							   })
						}else {
							wx.showToast({
							     title: '加入购物车失败',
							     duration: 2000//持续的时间
							   })
						}
					}
				})
			},
			toBlog(){
				uni.navigateTo({
					url:'/pages/ext/addBlog'
				})
			}
		}
	}
</script>

<style>
	.AddBlog{
		
	}
	.voucher{
		/* background-color: red; */
		padding-top: 4vw;
		display: block;
		/* border:4px solid red; */
		background: url("@/imgs/7.png") no-repeat 100% 100%;
		height: 130px;
		border-radius: 20px;
		margin: 10px;
		margin-bottom: 20px;
	}
	.voucherp{
		font-size: 15px;
		display: block;
		width: max-content;
		margin: 0 auto;
		margin-top: 10px;
	}
	.left{
		float: left;
		width: 50vw;
		/* background-color: gold; */
	}
	.left view{
		display: block;
		width: max-content;
		margin:0 auto;
		margin-top: 10px;
		margin-bottom: 10px;
	}
	.left p{
		display: block;
		width: max-content;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		margin:0 auto;
		font-size: 5px;		
		margin-top: 10px;
	}
	.left div{
		display: block;
		width: max-content;
		margin: 0 auto;
		margin-top: 10px;
	}
	.right{
		/* background-color: red; */
		padding-top: 8vw;
		width: 40vw;
		float: right
	}
	.right button{
		background-color: #ff4f4f;
		width: max-content;
		height: max-content;
		font-size: 10px;
		margin-top: 20px;
	}
	.right p{
		margin-top: 5vw;
		display: block;
		/* background-color: red; */
		width: 90px;
		overflow: hidden;
		white-space: nowrap;
	}
	.commodity{
		width: 100vw;
		display: block;
		margin: 0 auto;
	}
	.bigimg{
		width: 100vw;
		height: 100vw;
	}
	.money{
		float: left;
		background-color: transparent;
		text-align: left;
		padding: 2vw;
		padding-left: 5vw;
		
	}
	.itemName{
		text-align: center;
		word-break: break-all;
		overflow: hidden;
		width: 90vw;
		margin: 10px auto;
		max-lines: 2;
	}
	.commodityFoot{
		background-color: #c5ffaa;
		width: 100%;
		height: 13vw;
		display: flex;
		justify-content: center;
		align-items: center;
		box-shadow: 0 -1px 2px 1px rgb(0 0 0 / 10%);
		position: fixed;
		bottom: 0;
	}
	.buyit{
		float: right;
		margin-right: 2vw;
		background-color: #ffc0c0;
		font-size: 3vw;
		padding-top: 0px;
		width: 20vw;
		border-radius: 20px;
		height: 8vw;
	}
	.toshopscar{
		float: right;
		background-color: #ff4f4f;
		padding: 0px;
		width: 30vw;
		border-radius: 20px;
		margin: 0px;
		margin-right: 5vw;
		font-size: 3vw;
	}
</style>